<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
	<title>通讯录</title>
	<link rel="stylesheet" type="text/css" href="../../css/aui-win.css" />
<style>
.div_click{
	position: absolute;
	right: 5%;
	
	width:46px;
	height:36px;
	
}
.div_click img{
	margin:12px 0 0 20px;
}
.searchDiv input[type="text"] {
	width: 90%;
	margin-left: 2.5%;
	height: 36px;
	border-radius: 36px;
	border: 1px solid dimgray;
	padding-left: 5%;
	color: #B3B3B3;
}
.content{
				color:#333;
			}
a {
	text-decoration: none;
}
/*设置内容区样式*/
body {
	min-width: 320px;
}
#news {
	background-color: #f2f2f2;
}
#news ul li {
	overflow: hidden;
}
#news ul li a {
	width: 100%;
	display: inline-block;
	border-bottom: 0.2px solid white;
	padding: 10px 10px;
}
#news ul li a.active {
	background-color: #d9e4e9;
}
#news ul li .userimgs {
	float: left;
	width: 90px;
	height: 90px;
	border-radius: 4px;
}
#news .content {
	width: 65%;
	margin-left: 100px;
	overflow: hidden;
}
#news .content h2, #news h2 {
	font-size: 16px;
	height: 30px;
	font-weight: 800;
	margin-bottom: 6px;
	line-height: 30px;
}
.jobTitle {
	font-size: 16px;
	height: 50px;
	margin-bottom: 6px;
	background: white;
	line-height: 50px;
	padding-left: 2.5%;
	color:#333;
}
#txtNewsList li span{
	color:#333;
}
.jobTitle img {
	height: 16px;
	width: 16px;
	float:left;
	margin-top:17px;
}
.jobTitle span{
	float:left;
}
.memberList li {
	border-bottom: 1px solid white !important;
}
#news .content p {
	width: 100%;
	color: #999;
	height: 50px;
	overflow: hidden;
	font-size: 14px;
	line-height: 2;
	word-wrap: break-word;
}
#news .t .content div:after {
	content: "专题";
	background-color: #55abce;
	border: 1px solid #55abce;
	border-radius: 4px;
	color: #fff;
	font-size: 12px;
	padding: 2px 6px;
	float: right;
	height: 14px;
	line-height: 14px;
}
#news .v a:before {
	content: "";
	display: inline-block;
	background: #0c0a0f url(../image/video.png) no-repeat center;
	-webkit-background-size: 16px 12px;
	background-size: 16px 12px;
	width: 24px;
	height: 24px;
	border: 2px solid #666;
	border-radius: 24px;
	opacity: .8;
	position: absolute;
	left: 14px;
	top: 58px;
}
#txtNewsList {
	margin-top: 20px;
}
.searchDiv{
	height: 55px;
	width: 100%;
	position: fixed;
	top: 45px;
	z-index: 999;
	padding-top: 20px;
	background: #f5f5f5;
}
  li{
          list-style: none;
      }
      li .tte{
          width: 99%;
          height: 35px;
          text-align: center;
          line-height: 35px;
          background: #ddd;
          border:2px outset #eee;
          color: #333;
      }
      .tte:hover{
          background: #00abfd;
          color: white;
      }
      .main{
          display: none;
          padding: 5px 0 5px 0;
          background: #f9f9f9;
      }
        .main p{
        height: 25px;
        width: 100%;
        text-align: center;
        line-height: 25px;
        color: #666;
      }
</style>
</head>
<body>

    <div class="div_loding_img">
		数据加载中
	</div>
	<header class="aui-bar aui-bar-nav aui-bar-yunzo" id="aui-header">
		<a class="aui-btn aui-bar-yunzo aui-pull-left" id="back"> <span class="aui-iconfont aui-icon-left"></span></a>
		<div class="aui-title" id="title">
			通讯录
		</div>
	</header>
	<div class="margin_div" style="height:100px;"></div>
	
	<div class="searchDiv">
		<div class="div_click" onclick="fuzzySearch()"><img src="../../image/home/busess/search.png"></div>
		<input type="text" placeholder="查找请输入姓：" id="fuzzyText">
	</div>
	<div id="news">
		<div>
			<ul  id="txtNewsList"></ul>
		</div>
	</div>
<script src="../../script/jquery-1.10.2.min.js"></script>
<script src="../../script/common.js"></script>

<script type="text/javascript">
//显示数据条数
var pagesize =1000;
//当前数量
var curCount = 0;
//显示内容
var cid;
var objcontent;
var obj;
var gid;
$(document).ready(function(){
	goback("../main.html");
	obj=$('#txtNewsList');
	var Post =basedata('gcotactsinfo');
	ajaxcocRequest('../../../api/group/getgroupcontactforisopenlists', 'post', Post, function(msg){
		if(msg.code ==100){
			var html="";
			var num;
			if(msg["data"]!=null)
			{
				var data=msg["data"];
				for(var j=0;j<data.length;j++)
				{
					html+='<li> ';
					html+='<p class="tte">'+data[j].n1+'</p><div class="main"><ul>';
					for(var i=0;i<data[j].n2.length;i++){
						var thisItem=data[j].n2[i];
						num=thisItem.n6;
						html += '<li>';
							// html += '<div class="jobTitle" data-value="'+num+'" onclick="rec('+num+')">';
							html += '<div class="jobTitle" data-value="'+num+'" gid="'+data[j].n0+'" onclick="rec(this);">';
							html += '<span style="color:black;">' + thisItem.n0 + '</span>';
							html += '<span style="position:absolute;right:2.5%;"><img src="../../image/home/conten/smallPeople.png"><span style="margin:0px 5px;font-size:16px;">' + thisItem.n2 + "人" + '</span><img class="arrows" src="../../image/home/conten/downIcon.png"></span>';
							html += '</div><div class="11'+num+'" style="display:none;"></div></li>';
						//alert(JSON.stringify(msg["data"][0].n2))
					}
					html+='</ul></div></li>';
				}
				
				obj.append(html);
				$(".tte").click(function(){
				    $(this).next().slideToggle();
				   
				});
				$("img").error(function(){
					$(this).attr("src","../../image/home/busess/yunzo_def.png")
				});
			}	
	}
	else{
		$("body").append('<div class="wuwang"><img src="../../image/iconfont-wangluo.png"><p>网络拥堵，信息塞车</p></div>')
	}
	});
});



function getContentdata()
{
	  var Post =basedata('gcotactsinfo');
	    var num;
		ajaxcocRequest('../../../api/group/getgroupcontactlist', 'post', Post, function(msg){
			if(msg.code ==100){
				var html="";
				if(msg["data"]!=null)
				{
				for(var i=0;i<msg["data"].length;i++){
					var thisItem=msg['data'][i];
					num=thisItem.n6;

					html += '<li>';
						// html += '<div class="jobTitle" data-value="'+num+'" onclick="rec('+num+')">';
						html += '<div class="jobTitle" data-value="'+num+'" onclick="rec(this);">';
						html += '<span style="color:black;">' + thisItem.n0 + '</span>';
						html += '<span style="position:absolute;right:2.5%;"><img src="../../image/home/conten/smallPeople.png"><span style="margin:0px 5px;font-size:16px;">' + thisItem.n2 + "人" + '</span><img class="arrows" src="../../image/home/conten/downIcon.png"></span>';
						html += '</div><div class="11'+num+'" style="display:none;"></div></li>';
					//alert(JSON.stringify(msg["data"][0].n2))
				}
				
				obj.append(html);
				$("img").error(function(){
					$(this).attr("src","../../image/home/busess/yunzo_def.png")
				});
				}	
		}
		else{
			$("body").append('<div class="wuwang"><img src="../../image/iconfont-wangluo.png"><p>网络拥堵，信息塞车</p></div>')
		}
		});
			
}

function rec(e){
	cid=$(e).attr('data-value');
	gid=$(e).attr('gid');
	var tempnumber;
	var $listDiv=$(".11"+cid);
	if($listDiv.css("display")=="none"){
		$listDiv.css("display","block");
		var parambody =basedata('gcotactsinfo')+"&curCount="+curCount+"&cid="+cid+"&pagesize="+pagesize;
		ajaxcocRequest('../../../api/group/getmemberinfolistbycid', 'post', parambody, function(msg){
			if(msg.code ==100){
				var html="";
				var userSrc;
				for(var i=0;i<msg['data'].length;i++){	
					var thisItem=msg['data'][i];
					if(thisItem!=null)
					{
						html += '<a tapmode="active" onclick="openNews(\'' + thisItem.n4 + '\');">'
						html += '<div class="logo">'
						if(thisItem.n1=="null"){
							userSrc="../../image/tongxunlu.png";
						}else{
							userSrc=thisItem.n1;
						};
						if($mtype=="guest"||gid!=$groupid)
						{
							tempnumber=thisItem.n2.substring(1,0)+"**";
						}else
						{
							tempnumber=thisItem.n2;				
						}
							
						html += '<img class="userimgs" src="' + userSrc + '"/>'
						html += '</div>'
						html += '<div class="content">'
						html += '<h2 class="title">' + tempnumber + '</h2>'
						html += '<p>' + thisItem.n3 + '</p>'
						html += '</div></a>';
					}
				}
				
				$(".11"+cid).append(html);
				$("img").error(function(){
					$(this).attr("src","../../image/home/busess/yunzo_def.png")
				})
			}
			else{
				$("body").append('<div class="wuwang"><img src="../../image/iconfont-wangluo.png"><p>网络拥堵，信息塞车</p></div>')
			}
		});
	}
	else{
		$(".11"+cid).css("display","none");
		$(".11"+cid).empty();
		$("li div:eq(1)").css("display","none");
		$("li div:eq(1)").empty();
	}
	
}
sTart_Stop();
function fuzzySearch(){
	var likevalue=$('#fuzzyText').val();
	obj.html("");
	var bodyParam = {"mid":$mid,"groupid":$groupid,"did":initdata.get('gcotactsinfo'),"type":0,"pagesize":pagesize,"curcount":curCount,"likevalue":likevalue};
	ajaxCoCRequest('../../../api/group/querybyvalueforgroupcontactlist', 'POST', bodyParam, function(msg) {
		if (msg.code==100) {				
			$('#fuzzyText').val("");
			var html = '';
			
			for (var i = 0; i < msg['data'].length; i++) {
				var thisItem = msg['data'][i];
				html += '<li>'
				html += '<div class="jobTitle">'
				html += '<span style="font-weight:600;">' + thisItem.n0 + '</span>'
				html += '<span style="position:absolute;right:2.5%;"><img src="../../image/icon/smallPeople.png"><span style="margin:0px 5px;font-size:20px;">' + thisItem.n5.length + "人" + '</span><img class="arrows" src="../../image/icon/downIcon.png"></span>'
				html += '</div>'
				html += '<div class="memberList" style="display:none;"><ul>'
				for (var j = 0; j < thisItem.n5.length; j++) {
					if(thisItem.n5[j].n1=="null"){
							userSrc="../../image/defaultImg2.png";
						}else{
							userSrc=thisItem.n5[j].n1;
						};
					html += '<li>'
					html += '<a tapmode="active" onclick="openNews(\'' + thisItem.n5[j].n4 + '\');">'
					html += '<div class="logo">'
					html += '<img class="userimgs" src="' + userSrc + '"/>'
					html += '</div>'
					html += '<div class="content">'
					html += '<h2 class="title">' + $mtype=="guest"?thisItem.n5[j].n2 .substring(1,0):thisItem.n5[j].n2 + '</h2>'
					html += '<p>' + thisItem.n5[j].n3 + '</p>'
					html += '</div></a>'
					html += '</li>'
				}
				html += '</ul></div>'
				html += '</li>'
			}
			
			obj.html(html);
			$("img").error(function(){
				$(this).attr("src","../../image/home/busess/yunzo_def.png")
			})
			var $memberMenu = $(".jobTitle");
			var $listDiv = $(".memberList");
			var $arrows = $(".arrows");
			$memberMenu.click(function() {
				var index = $memberMenu.index(this);
				if ($listDiv[index].style.display == "none") {
					$listDiv[index].style.display = "block";
					$arrows[index].src = "../../image/icon/upIcon.png";
				} else {
					$listDiv[index].style.display = "none"
					$arrows[index].src = "../../image/icon/downIcon.png";
				}
			});

		} else {
			$("body").append('<div class="wuwang"><img src="../../image/iconfont-wangluo.png"><p>网络拥堵，信息塞车</p></div>')
		}
	});
}
function openNews(infoid)
{	
	var flag=0;
	if(gid!=$groupid)
	{
		flag=1;
	}
	window.location='selfinfo.html'+'?infoid='+infoid+"&flag="+flag;
}
</script>
</body>
</html>